<template>
	<view class="goods">
		<view class="img">
			<image :src="goods.goodsImg" mode="scaleToFill"></image>
		</view>
		<view class="info">
			<text class="name">{{goods.goodsName}}</text>
			<text class="price">单价:￥{{goods.price}}</text>
			<text class="count">数量:{{goods.count}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			goods: {}
		},
		setup(props) {
			console.log(props);
		}
	}
</script>

<style lang="scss">
	.goods {
		display: flex;
		height: 200rpx;
		padding: 20rpx;
		margin-bottom: 10rpx;

		.img {
			flex: 1;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.info {
			flex: 2;
			padding-left: 20rpx;

			.name {
				font-weight: 800;
				display: block;
				margin-bottom:15rpx;
			}

			.price {
				font-size: 32rpx;
				display: block;
				margin-bottom:15rpx;
				color: red;
			}

			.count {
				font-size: 28rpx;
				display: block;
				margin-bottom:15rpx;
				color: #ccc;
			}

		}

	}
</style>
